function touchBottom(e) {
    let scrollTop = document.documentElement.scrollTop,
        windowHeight = document.documentElement.clientHeight,
        scrollHeight = document.documentElement.scrollHeight;
    if (scrollTop + windowHeight >= scrollHeight - 300) {
        // 加载页面
        homeLazy.render()
    }
}

$(touchBottom)

window.onscroll = touchBottom

// ['groupFloor ?', 'oneImage +', 'groupFloor +', 'prolistBackground +']
// url 请求的PHP地址  
// limit 限定请求次数  ? = 请求一次 ; + 无限制请求 直到请求失败
// query 发送请求时携带的参数 
// id 请求的模板的的ID值

// 修改里面的参数即可
const option = [
    {
        id: '#groupFloor',
        url: '/php/groupFloor.php',
        limit: '?',
        query: { page: null }
    },
    {
        id: '#oneImage',
        url: '/php/oneimage.php',
        limit: '+',
        query: { page: null }
    },
    {
        id: '#groupFloor',
        url: '/php/groupFloor.php',
        limit: '+',
        query: { page: null }
    },
    {
        id: '#prolistBackground',
        url: '/php/prolistBackground.php',
        limit: '+',
        query: { page: null }
    }
]


class Lazy {
    // 存储上方声明的变量
    library = {}

    lock = true

    // 解析变量
    constructor(option) {
        this.$option = option
    }

    condition(str) {
        // 项目只用到 ? 和 + 不进行判错
        return /[\?]/gi.test(str)
    }

    init(option) {
        if (!this.library[option.id + '$page']) {
            option.query.page = this.library[option.id + '$page'] = 1
        } else {
            option.query.page = this.library[option.id + '$page']
        }
    }

    component(data, template) {
        let html = ejs.render(template, { data })
        $('main').append(html)
    }

    render() {
        if (this.lock) {
            let position = this.$option[0]

            this.lock = false

            if (!position) { return }

            this.init(position)

            $.get(position.url, position.query, res => {

                this.lock = true

                // res 请求为空 直接条件失效 // 根据模板进行渲染
                // 不为空 进行渲染然后进行条件判断
                // 自增
                let data = JSON.parse(res)

                if (data.code === 0) {
                    this.$option.shift()
                    return this.render()
                }

                this.component(data.data, $(position.id).html())

                this.library[position.id + '$page']++

                if (this.condition(position.limit)) {
                    this.$option.shift()
                }
            })
            // if (library[this.$option])
            // 请求为空 flag++ 在进行新的请求 只为一次加载完毕瞬跳 ?? 请求地址返回数据 还是回调函数
            // 先 page 然后进行判断
        }
    }
}

const homeLazy = new Lazy(option)